<template>
  <PublicPage page-name="选择带货笔记" :borderType="true">
    <!-- <u-tabs
      :list="tabList"
      :is-scroll="false"
      :current="tabsCur"
      :bold="false"
      :bar-style="{bottom: '-1px !important;'}"
      bar-height="4"
      active-color="#E44435"
      inactive-color="#969799"
      height="92"
      font-size="32"
      @change="_tabsChange"
    /> -->
    <u-tabs
    :list="subTabList"
    :current="subTabsCur"
    active-color="#E44435"
    inactive-color="#646566"
    bar-height="0"
    font-size="24"
    height="80"
    @change="subTabsChangeFn"
    ></u-tabs>
    <view class="assembly_list_box" v-if="isAssemblyList">
      <!-- 视频图片在一起版本的笔记 -->
      <TakeNotes :spuId="routeData.spuId" :shopWindowId="routeData.shopWindowId" :sortType="sortType"/>
      <!-- 视频笔记 -->
      <!-- <VideoNotes v-show="tabsCur==0" ref="childVideoNotes" :spuId="routeData.spuId" :shopWindowId="routeData.shopWindowId" :mediaType="mediaType" :sortType="sortType"/> -->
      <!-- 图文笔记 -->
      <!-- <GraphicNotes v-show="tabsCur==1" :spuId="routeData.spuId" :shopWindowId="routeData.shopWindowId" :mediaType="mediaType" :sortType="sortType" /> -->
    </view>
  </PublicPage>
</template>
<script>
import PublicPage from "@/components/publicPage/index.vue"
import TakeNotes from "../takeNotes/takeNotes.vue"
// import VideoNotes from "../takeNotes/videoNotes.vue"
// import GraphicNotes from "../takeNotes/graphicNotes.vue"
export default {
  components: {
    PublicPage,
    TakeNotes
    // GraphicNotes,
    // VideoNotes
  },
  data () {
    return {
      routeData: {},
      tabList: [
        {
          value: 2,
          name: '视频'
        },
        {
          value: 1,
          name: '图文'
        }
      ], // tabs列表
      tabsCur: '', // tabs当前激活标识
      mediaType: 1,
      subTabList: [
        {
          value: 1,
          name: '最新',
        },
        {
          value: 2,
          name: '最热',
        },
        // {
        //   value: 3,
        //   name: '成交量'
        // },
        // {
        //   value: 4,
        //   name: '转化率'
        // }
      ],
      subTabsCur: 0, // 子Tab标识
      sortType: 1, // 子Tab值
      isAssemblyList: false,
    }
  },
  onLoad(option) {
    this.routeData = option
    this.isAssemblyList = true
    this.tabsCur = this.routeData.mediaType ? Number(this.routeData.mediaType)-1 : 0  // 有传TAB类型就需要赋值选择是视频还是图片
  },
  // 分享
  onShareAppMessage() {
    return {
      path: '/pages/index/index',
      title: "我想帮你卖货，快来发布商品设置佣金！供货分销轻松收单！",
      imageUrl: `https://qqposs.oss-cn-shenzhen.aliyuncs.com/mpAppImg/bgImg/new_selectGoods_share.png?t=${Date.parse(new Date())}`,
    };
  },
  methods: {
    // tabs切换
    _tabsChange(index) {
      this.tabsCur = index
      this.mediaType = this.tabList[index].value
      this.$refs.childVideoNotes.tabPayFn(this.mediaType)  // 调用视频组件方法暂停播放视频
      this.sortType = 1 // 切换大TAB需要切换小的属性
    },
    // 子tab切换
    subTabsChangeFn (index) {
      this.subTabsCur = index
      this.sortType = this.subTabList[index].value
    },
  }
}
</script>
<style lang="scss" scoped>
.assembly_list_box {
  height: calc(100% - 88rpx)
}
</style>